<template>
    <!-- 组件结构 -->
    <div class="school">
        <h2 @click="showName">学校名称：{{name }}</h2>
        <h2>学校地址：{{address}}</h2>
    </div>
</template>
<script>
    import pubsub from 'pubsub-js'
import { onMounted, onUnmounted } from 'vue'
    export default {
        name: 'School',
        data(){
            return{
                name:'Polaris',
                address:'青岛'
            }
        },
        setup(){
            let pubId;
            onMounted(()=>{
                //订阅
                pubId = pubsub.subscribe('hello', function(methodName, msg){
                    console.log('有人发布了hello消息，hello消息的回调执行了.',msg)
                })
            })
            onUnmounted(()=>{
                //取消订阅
                pubsub.unsubscribe(pubId)
                console.log('Unsubscribed from hello event')
            })
        },
    }
</script>
<style scope>
    .school{
        background-color: skyblue;
        padding: 5px;
    }
</style>
